<template>
  <a-card>
    <template slot="extra">
      <a-button type="link" @click="$router.push({ name: 'AddCategory' })">一级分类</a-button>
      <a-button type="link" @click="$router.push({ name: 'AddSecondCategory' })">二级分类</a-button>
      <a-button type="link" @click="$router.push({ name: 'AddProduct' })">添加产品</a-button>
    </template>
    <a-form-model
      :model="form"
    >
      <a-form-model-item label="一级分类">
        <a-select v-model="form.pid">
          <a-select-option v-for="(item,index) in parentOpts" :key="index" :value="index">
            {{item}}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="分类名称">
        <a-input v-model="form.name" type="text" />
      </a-form-model-item>
      <a-form-model-item>
        <a-button type="primary" @click="addSecond">添加分类</a-button>
      </a-form-model-item>
    </a-form-model>
  </a-card>
</template>

<script>
import { getAddSecondCategory, postAddSecondCategory } from '@/api/product'

export default {
  name: 'AddSecondCategory',
  data () {
    return {
      form: {},
      parentOpts: {}
    }
  },
  created () {
    this.getParent()
  },
  methods: {
    getParent () {
      getAddSecondCategory().then(res => {
        this.parentOpts = res.result.parentData
      })
    },
    addSecond () {
      postAddSecondCategory(this.form).then(res => {
        console.log(res)
      })
    }
  }
}
</script>

<style scoped>

</style>
